<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>安平通行码</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
</head>
<style>
    * {
        background: #F2F6FB;
    }

    .layui-text {
        background: #D7E8FF;
        line-height: 16px;
        color: #265DA4;
        font-weight: bolder;
        font-size: 16px;
    }

    .layui-input,
    .layui-textarea {
        width: 95%;
        background: #E9F1FB;
        border-color: #E9F1FB;
        border-radius: 4px;
        box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.2);
    }

    .layui-form-item .layui-form-label {
        text-overflow: clip;
    }

    .input-code {
        width: 55%;
        display: inline;
    }

    #send_phone {
        padding: 0;
        width: 35%;
        float: right;
        margin-right: 15px;
        font-size: 12px;
    }

    .footer {
        text-align: center;
        font-size: 12px;
        color: #666666;
        position: fixed;
        bottom: 0;
        width: 100%;
    }

    .footer p {
        margin: 5px 0;
    }

    .layui-elem-quote {
        text-align: center;
        border-left: none;
    }

    .layui-form-radio>i:hover,
    .layui-form-radioed>i {
        color: #275DA4;
    }


    .layui-btn {
        background-color: #275DA4;
        box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.2);
    }

    textarea {
        border: 1px solid #E9F1FB;
        resize: none;
        background: #E9F1FB;
        box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.2);
    }

    .tishi {
        text-align: center;
        color: #666;
        font-size: 14px;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .layui-form-label {
        padding: 9px 9px 9px 0;
    }

    .layui-input-block {
        margin-left: 91px;
    }

    #launch-btn {
        width: 240px;
        padding-left: 60px;
        background: #fff;
    }

    .b {
        background-color: #cbcbcb;
    }

    .htmls {
        min-height: 480px;
    }
</style>

<body>
    <blockquote class="layui-elem-quote layui-text">
        安平通行码登记
    </blockquote>

    <form class="layui-form" action="">
        <div class="htmls">
            <input type="hidden" name="wxcode" class="_wxcode">
            <div class="layui-form-item layui-form-name">
                <label class="layui-form-label">姓名*</label>
                <div class="layui-input-block">
                    <input type="text" name="name" lay-verify="required" lay-reqtext="请输入真实姓名" autocomplete="off"
                        placeholder="请输入姓名" class="layui-input layui_name" maxlength="4">
                </div>
            </div>

            <div class="layui-form-item layui-form-idCard">
                <label class="layui-form-label">身份证号码*</label>
                <div class="layui-input-block">
                    <input type="text" name=" idCard" lay-verify="identity" placeholder="请输入身份证号码" autocomplete="off"
                        class="layui-input layui_idCard" maxlength="18">
                </div>
            </div>

            <div class="layui-form-item layui-form-phone">
                <label class="layui-form-label">手机号*</label>
                <div class="layui-input-block">
                    <input type="number" name="phone" id="L_phone" lay-verify="phone" lay-reqtext="请输入手机号"
                        placeholder="请输入手机号" autocomplete="off" class="layui-input layui_phone" maxlength="11">
                </div>
            </div>

            <div class="layui-form-item layui-form-code">
                <div class="layui-input-block">
                    <input type="text" name="code" lay-verify="code" lay-reqtext="请输入验证码" placeholder="请输入验证码"
                        autocomplete="off" class="layui-input input-code" maxlength="4">
                    <button type="button" class="layui-btn" id="send_phone">
                        获取验证码
                    </button>
                </div>
            </div>

            <div class="layui-form-item" style="text-align: center;">
                <button type="submit" class="layui-btn layui-date" lay-submit="" lay-filter="demo1"
                    style="width: 200px;">下一步</button>
            </div>
        </div>
        <img src="http://hesuan.city1000.cn/images/tishi.png" alt="" width="90%"
            style="margin-left: 4%;margin-top: 20px;">
        <div class="tishi">技术支持: 智慧安平</div>

    </form>

    <script src="layui/layui.js" charset="utf-8"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/fastclick/1.0.6/fastclick.min.js"></script>
    <script>
        layui.use(['form', 'layer', 'jquery'], function () {
            var form = layui.form,
                layer = layui.layer,
                $ = layui.jquery;
            var rukouName = getQueryVariable("state")
            $(document).ready(function () {
                FastClick.attach(document.body);
            })
            //自定义验证规则
            form.verify({
                phone: [/^1[3456789]\d{9}$/, "请输入正确的手机号"],
                identity: [/(^\d{15}$)|(^\d{17}(x|X|\d)$)/, "请输入正确的身份证号"],
                code: function (value) {
                    if (!value || isNaN(value)) return "请填写正确的验证码"
                }
            });
            //锁
            var codeStatus = true;
            //发送验证码
            $('#send_phone').on('click', function () {
                var phone = $('#L_phone').val();
                var reg = /^1[3456789]\d{9}$/;
                if (!reg.test(phone)) {
                    layer.msg('请输入正确的手机号', {
                        icon: 2
                    });
                    return false;
                }
                if (codeStatus) {
                    // 发送验证码
                    $.post(ymt_api+'/api/hsVerificationCode', {
                        phone: phone
                    }, function (res) {
                        console.log(res.code)
                        //请求成功
                        if (res.code == 0) {
                            codeStatus = false;
                            var setTime;
                            var time = 60;
                            setTime = setInterval(function () {
                                if (time == 0) {
                                    clearInterval(setTime);
                                    codeStatus = true;
                                    $("#send_phone").removeClass("b");
                                    $("#send_phone").text("获取验证码");
                                    return;
                                } else {
                                    $("#send_phone").addClass("b");
                                    $("#send_phone").text(time + "s后重新获取");
                                }
                                time--;
                            }, 1000);
                        } else {
                            layer.msg(res.msg, {
                                icon: 2
                            });
                        }
                    })
                }
            })
            //监听提交
            form.on('submit(demo1)', function (data) {
                var loadIndex;
                // $.ajax({
                //     url: ymt_api+'/ymtUserDanwei/insert',
                //     data: data.field,
                //     type: "post",
                //     beforeSend: function () {
                //         // 点击后阴影效果
                //         loadIndex = layer.load(1, {
                //             shade: [0.3, 'rgb(0, 0, 0)']
                //         })
                //     },
                //     success: function (res) {
                //         // 成功
                //         if (res.code == 0) {
                //             //alert('注册成功')
                //             //alert('openid:'+res.data)
                //             var open_datas = `${rukouName}|${res.data}`
                //             window.location.href =
                //                 "http://hesuan.city1000.cn/code/YesOrNo.html?state=" +
                //                 open_datas
                //         } else {
                //             // 失败
                //             // alert("重新登记")
                //             layer.confirm(res.msg, {
                //                 title: '系统提示'
                //             }, function (index) {
                //                 getCode('http://hesuan.city1000.cn/code/registerFirst.html',
                //                     rukouName)
                //             });
                //         }
                //     },
                //     error: function () {
                //         layer.msg('系统维护更新中，请稍后...', {
                //             icon: 2
                //         });
                //     },
                //     complete: function () {
                //         layer.close(loadIndex);
                //     }
                // });
				location.replace('http://txm.city1000.cn/code_index.html');
                return false;
            });

        });
        // 获取code
        function getQueryVariable(variable) {
            // 参数 window.location.search
            var query = decodeURI(window.location.search.substring(1));
            var vars = query.split("&");
            for (var i = 0; i < vars.length; i++) {
                var pair = vars[i].split("=");
                if (pair[0] == variable) {
                    return pair[1];
                }
            }
            return (false);
        }
        // 转发刷新code
        function getCode(urls, _data) {
            $.ajax({
                type: "get",
                url: "http://user.city1000.top/wechat/wxScan", //自己填写请求地址
                data: {
                    url: window.location.href
                },
                success: function (result) {
                    //alert(result.appId)
                    var appID = result.appId
                    var redirectUri = encodeURI(urls); // 授权成功后重定向地址
                    var state = _data; // 状态标识（用于项目拓展)
                    // 跳转授权(拿到用户信息)
                    var strUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" +
                        appID +
                        "&redirect_uri=" + redirectUri +
                        "&response_type=code&scope=snsapi_base&state=" + state +
                        "#wechat_redirect";
                    window.location.href = strUrl;
                }
            })
        }
    </script>

</body>

</html>